<template>
  <div class="resource container">
    <div class="search-box">
      <el-row :gutter="20">
        <el-form label-width="100px" size="small" class="searchForm">
          <el-col :span="6">
            <el-form-item label="公司名称:">
              <el-input
                v-model="params.companyName"
                size="mini"
                clearable
                @keyup.enter.native="search"
                @clear="search"
              ></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item label="客户姓名:">
              <el-input
                v-model="params.customerName"
                size="mini"
                clearable
                @keyup.enter.native="search"
                @clear="search"
              ></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item label="联系电话:">
              <el-input
                v-model="params.customerPhone"
                size="mini"
                clearable
                @keyup.enter.native="search"
                @clear="search"
              ></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item label="国家:">
              <el-input
                v-model="params.country"
                size="mini"
                clearable
                @keyup.enter.native="search"
                @clear="search"
              ></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item label="洲:">
              <el-select
                v-model="params.continent"
                placeholder="请选择洲"
                size="mini"
                clearable
                filterable
                @change="search"
              >
                <el-option
                  v-for="item in continentlist"
                  :key="item.label"
                  :label="item.label"
                  :value="item.label"
                ></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item label="客户邮箱:" v-if="!openFlag">
              <el-input
                v-model="params.email"
                size="mini"
                clearable
                @keyup.enter.native="search"
                @clear="search"
              ></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item label="客户官网:" v-if="!openFlag">
              <el-input
                v-model="params.officialWebsite"
                size="mini"
                clearable
                @keyup.enter.native="search"
                @clear="search"
              ></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item label="客户等级:">
              <el-select
                v-model="params.grade"
                placeholder="选择客户等级"
                clearable
                filterable
                @change="search"
              >
                <el-option
                  v-for="item in levelList"
                  :key="item.gradeValue"
                  :label="item.gradeName"
                  :value="item.gradeValue"
                ></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item label="来源:">
              <el-select v-model="params.source" filterable clearable @change="search">
                <el-option
                  v-for="item in levelList5"
                  :key="item.dictValue"
                  :label="item.dictLabel"
                  :value="item.dictValue"
                ></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item label="标签:">
              <!-- <el-autocomplete
                class="inline-input"
                v-model="params.label"
                :fetch-suggestions="querySearch"
                placeholder="请输入内容"
                value-key="context"
                clearable
                @clear="search"
              ></el-autocomplete> -->
              <el-select v-model="params.label" clearable placeholder="请选择标签" @change="search" filterable >
                <el-option
                  v-for="item in labels"
                  :key="item.id"
                  :label="item.context"
                  :value="item.context"
                ></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item label="客户类型:" v-if="!openFlag">
              <el-select
                v-model="params.customerRole"
                clearable
                filterable
                @change="search"
              >
                <el-option
                  v-for="item in customerRoleList"
                  
                  :key="item.dictValue"
                  :label="item.dictLabel"
                  :value="item.dictValue"
                ></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item label="新/老客户:" v-if="!openFlag">
              <el-select
                filterable
                v-model="params.customerType"
                clearable
                @change="search"
              >
                <el-option
                  v-for="item in typeList"
                  :key="item.id"
                  :label="item.title"
                  :value="item.id"
                ></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item label="原归属人:" v-if="!openFlag">
              <!-- <el-input
                v-model="params.userName"
                size="mini"
                clearable
                @keyup.enter.native="search"
                @clear="search"
              ></el-input> -->
              <el-select
                filterable
                v-model="params.belonger"
                clearable
                @change="search"
              >
                <el-option
                  v-for="item in sysUserList"
                  :key="item.userId"
                  :label="item.userName"
                  :value="item.userId"
                ></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="6" v-if="openFlag">
            <el-button
              @click="search"
              icon="el-icon-search"
              size="mini"
              type="primary"
              >搜索</el-button
            >
            <el-button
              icon="el-icon-folder-opened"
              type="success"
              size="mini"
              @click="openSearch"
              >展开</el-button
            >
            <el-button
              @click="cancelData"
              icon="el-icon-refresh"
              size="mini"
              type="warning"
              >重置</el-button
            >
          </el-col>
          <el-col :span="6" v-if="!openFlag">
            <el-button
              @click="search"
              icon="el-icon-search"
              type="primary"
              size="mini"
              >搜索</el-button
            >
            <el-button
              @click="openSearch"
              icon="el-icon-folder-opened"
              type="success"
              size="mini"
              >收起</el-button
            >
            <el-button
              @click="cancelData"
              icon="el-icon-refresh"
              size="mini"
              type="warning"
              >重置</el-button
            >
          </el-col>
        </el-form>
      </el-row>
    </div>

    <div>
      <div class="handle-box">
        <el-button
          type="danger"
          icon="el-icon-delete"
          class="handle-del mr10"
          size="mini"
          @click="delAllSelection"
          :disabled="isOperate"
          >批量删除</el-button
        >
        <el-button
          size="mini"
          type="primary"
          icon="el-icon-plus"
          @click="handleAdd"
          class="mr10"
          >新增</el-button
        >
        <el-button
          size="mini"
          type="warning"
          icon="el-icon-position"
          @click="allApply"
          class="mr10"
          >资源下发</el-button
        >
        <!-- 管理员上传 -->
        <el-upload
          v-loading="uploading"
          class="mr10"
          style="display: inline-block; margin-top: 10px"
          action
          :http-request="uploadFile"
          :limit="1"
          :on-exceed="fileExceed"
          accept="application/vnd.openxmlformats-officedocument.spreadsheetml.sheet, application/vnd.ms-excel"
          :file-list="uploadList"
          :show-file-list="false"
          ref="fileupload"
        >
          <el-button size="mini" type="success" class="el-icon-s-promotion"
            >管理员资源导入</el-button
          >
        </el-upload>
      </div>

      <el-table
        v-loading="loading"
        :data="tableData"
        :max-height="tableHeight"
        style="width: 100%;"
        border
        class="table"
        ref="multipleTable"
        header-cell-class-name="table-header"
        @selection-change="handleSelectionChange"
        @sort-change="handleSortChange"
      >
        <el-table-column
          type="selection"
          width="55"
          align="center"
        ></el-table-column>
        <el-table-column label="公司名称" fixed width="150" align="center" :show-overflow-tooltip="true">
          <template slot-scope="scope">
            <span
              class="blue"
              style="text-decoration: underline; margin-left: 5px"
              @click="handleEdit(scope.$index, scope.row)"
              >{{ scope.row.companyName }}</span
            >
          </template>
        </el-table-column>
        <el-table-column
          prop="customerName"
          label="客户姓名"
          min-width="140"
          align="center"
          fixed
          :show-overflow-tooltip="true"
        ></el-table-column>
        <el-table-column
          label="国家"
          align="center"
          width="120"
          :show-overflow-tooltip="true"
          fixed
        >
          <template slot-scope="scope">
            {{scope.row.country}}
          </template>
        </el-table-column>
        <el-table-column label="客户等级" width="140" align="center">
          <template slot-scope="scope">
            <span>{{ formatLevel(scope.row.grade) }}</span>
          </template>
        </el-table-column>
        <el-table-column label="客户类型" min-width="100" align="center">
          <template slot-scope="scope">
            <span>{{ formatRole(scope.row.customerRole) }}</span>
          </template>
        </el-table-column>
        <el-table-column label="新/老客户" min-width="120" align="center">
          <template slot-scope="scope">
            <span>{{ formatType(scope.row.customerType) }}</span>
          </template>
        </el-table-column>
        <el-table-column label="标签" min-width="100" align="center">
          <template slot-scope="scope">
            <el-tag>{{ scope.row.label }}</el-tag>
          </template>
        </el-table-column>
        <el-table-column label="来源" min-width="120" align="center">
          <template slot-scope="scope">
            <span>{{ scope.row.source }}</span>
          </template>
        </el-table-column>
        <el-table-column label="原归属人" min-width="120" align="center" prop="belongerName">
        </el-table-column>
        <el-table-column
          prop="customerPhone"
          label="联系电话"
          align="center"
          min-width="150"
          :show-overflow-tooltip="true"
        ></el-table-column>
        <el-table-column
          label="备注"
          align="center"
          width="150"
          prop="remark"
          :show-overflow-tooltip="true"
        />
        <el-table-column
          prop="email"
          label="客户邮箱"
          align="center"
          fixed
          width="160"
          :show-overflow-tooltip="true"
        ></el-table-column>
        <el-table-column
          label="客户官网"
          align="center"
          min-width="210"
        >
          <template slot-scope="scope">
            <div v-if="scope.row.officialWebsite">
              <div v-for="item in scope.row.officialWebsite.split(',')" :key="item">
                <a :href="item" target="_blank">{{item}}</a>
              </div>
            </div>
          </template>
        </el-table-column>
        <!-- <el-table-column
          prop="landlinePhone"
          label="座机电话"
          align="center"
          min-width="150"
        ></el-table-column> -->
        
        <!-- <el-table-column
          prop="continent"
          label="所属洲"
          align="center"
          min-width="150"
        ></el-table-column>
        <el-table-column
          label="国家"
          align="center"
          width="150"
          prop="country"
          :show-overflow-tooltip="true"
        />
        <el-table-column
          label="城市"
          align="center"
          width="150"
          prop="city"
          :show-overflow-tooltip="true"
        /> -->
        <el-table-column label="创建时间" prop="createTime"  align="center" min-width="160" :sortable="'custom'">
          <template slot-scope="scope">{{ scope.row.createTime }}</template>
        </el-table-column>
        <el-table-column
          label="操作"
          min-width="130"
          align="center"
          fixed="right"
        >
          <template slot-scope="scope">
            <el-button
              type="success"
              size="mini"
              icon="el-icon-view"
              @click="handleViewLog(scope.$index, scope.row)"
              >小记</el-button
            >
            <!-- <el-button
              type="primary"
              size="mini"
              icon="el-icon-check"
              @click="handleReceive(scope.row)"
              >领取</el-button
            > -->
          </template>
        </el-table-column>
      </el-table>
      <div class="pagination">
        <pagination
          v-show="pageTotal > 0"
          :total="pageTotal"
          :page.sync="params.pageNum"
          :limit.sync="params.pageSize"
          @pagination="getData00"
        />
      </div>
    </div>

    <el-dialog
      title="资源下发"
      :visible.sync="applyVisible"
      width="1300px"
      label-width="160px"
    >
      <el-form
        ref="ruleForm"
        label-width="100px"
        :model="applyData"
        :rules="rules"
      >
        <el-col :span="24">
          <el-form-item label="被转移人" prop="targetUid">
            <el-select
              v-model="applyData.targetUid"
              filterable
              no-data-text="正在加载数据"
            >
              <el-option
                v-for="item in sysUserList"
                :key="item.userId"
                :label="item.userName"
                :value="item.userId"
              ></el-option>
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :span="16">
          <el-form-item label="被转移客户">
            <el-select
              v-model="input555"
              placeholder="请选择客户等级"
              size="small"
              clearable
              @change="search6"
            >
              <el-option
                v-for="item in levelList"
                :key="item.gradeValue"
                :label="item.gradeName"
                :value="item.gradeValue"
              ></el-option>
            </el-select>
            <el-input
              style="width: 220px"
              placeholder="请输入客户邮箱"
              v-model="input666"
              clearable
              class="input-with-select"
              @clear="search6"
            >
            </el-input>
            <el-input
              style="width: 220px"
              placeholder="请输入公司名称"
              v-model="input333"
              clearable
              class="input-with-select"
              @clear="search6"
            >
              <el-button
                slot="append"
                icon="el-icon-search"
                @click="search6"
              ></el-button>
            </el-input>
          </el-form-item>
        </el-col>

        <el-table
          v-loading="loading"
          :data="tableData1"
          border
          class="table"
          ref="multipleTable1"
          header-cell-class-name="table-header"
          @selection-change="handleSelectionChange1"
        >
          <el-table-column
            type="selection"
            width="50"
            align="center"
          ></el-table-column>
          <el-table-column label="公司名称" min-width="260" align="center">
            <template slot-scope="scope">
              <span>{{ scope.row.companyName }}</span>
            </template>
          </el-table-column>
          <el-table-column
            prop="email"
            label="客户邮箱"
            align="center"
            min-width="150"
          ></el-table-column>
          <el-table-column
            prop="customerName"
            label="客户姓名"
            align="center"
            min-width="100"
          ></el-table-column>
          <el-table-column label="客户等级" min-width="100" align="center">
            <template slot-scope="scope">
              <span>{{ formatLevel(scope.row.grade) }}</span>
            </template>
          </el-table-column>
          <el-table-column label="客户标签" min-width="100" align="center">
            <template slot-scope="scope">
              <el-tag>{{ scope.row.label }}</el-tag>
            </template>
          </el-table-column>
          <el-table-column label="客户来源" min-width="100" align="center">
            <template slot-scope="scope">
              <span>{{ formatSource(scope.row.source) }}</span>
            </template>
          </el-table-column>
          <el-table-column label="新/老客户" min-width="100" align="center">
            <template slot-scope="scope">
              <span>{{ formatType(scope.row.customerType) }}</span>
            </template>
          </el-table-column>
          <el-table-column label="客户类型" min-width="100" align="center">
            <template slot-scope="scope">
              <span>{{ formatRole(scope.row.customerRole) }}</span>
            </template>
          </el-table-column>
          <el-table-column
            prop="customerPhone"
            label="联系电话"
            align="center"
            min-width="130"
          ></el-table-column>
          <el-table-column label="录入时间" align="center" min-width="160">
            <template slot-scope="scope">{{ scope.row.createTime }}</template>
          </el-table-column>
        </el-table>
        <div class="pagination">
          <pagination
            v-show="pageTotal1 > 0"
            :total="pageTotal1"
            :page.sync="params.pageNum"
            :limit.sync="params.pageSize"
            @pagination="getData1"
          />
        </div>
      </el-form>
      <span slot="footer" class="dialog-footer">
        <el-button @click="appleSubmitForm()" type="primary" size="small"
          >确定</el-button
        >
      </span>
    </el-dialog>

    <!-- 新增编辑 -->
    <el-dialog :title="title666" :visible.sync="dialogVisible" width="1000px">
      <el-form
        :rules="rules2"
        ref="zhiyuanRuleForm"
        :model="formData"
        label-width="120px"
        size="small"
        class="form-box"
      >
        <el-row :gutter="20">
          <el-col :span="8">
            <el-form-item label="公司名称" prop="companyName">
              <el-input
                v-model="formData.companyName"
                :disabled="editFlags"
              ></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="客户邮箱" prop="email">
              <el-input v-model="formData.email"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="客户姓名" prop="customerName">
              <el-input v-model="formData.customerName"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="客户等级" prop="grade">
              <el-select v-model="formData.grade" placeholder="请选择客户等级">
                <el-option
                  v-for="item in levelList"
                  :key="item.gradeValue"
                  :label="item.gradeName"
                  :value="item.gradeValue"
                >
                </el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="客户类型" prop="customerRole">
              <el-select
                v-model="formData.customerRole"
                placeholder="请选择客户类型"
              >
                <el-option
                  v-for="dict in customerRoleList"
                  :key="dict.dictValue"
                  :label="dict.dictLabel"
                  :value="dict.dictValue"
                ></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="联系电话" prop="customerPhone">
              <el-input v-model="formData.customerPhone"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="客户官网">
              <el-input v-model="formData.officialWebsite"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="新/老客户" prop="customerType">
              <el-select
                v-model="formData.customerType"
                placeholder="请选择新老客户"
              >
                <el-option
                  v-for="item in typeList"
                  :key="item.id"
                  :label="item.title"
                  :value="item.id"
                >
                </el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="来源" prop="source">
              <el-select v-model="formData.source">
                <el-option
                  v-for="item in levelList5"
                  :key="item.dictValue"
                  :label="item.dictLabel"
                  :value="item.dictValue"
                ></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="标签">
              <!-- <el-autocomplete
                class="inline-input"
                v-model="formData.label"
                :fetch-suggestions="querySearch"
                placeholder="请输入标签"
                value-key="context"
                clearable
              ></el-autocomplete> -->
              <el-select v-model="formData.label" clearable placeholder="请选择标签">
                <el-option
                  v-for="item in labels"
                  :key="item.id"
                  :label="item.context"
                  :value="item.context"
                ></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="国家" prop="country">
              <el-select
                v-model="formData.country"
                placeholder="请选择所属国家"
                size="mini"
                clearable
                filterable
                @change="choose_country"
              >
                <el-option
                  v-for="item in countryList"
                  :key="item.id"
                  :label="item.country"
                  :value="item.country"
                ></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="城市">
              <el-input v-model="formData.city"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="16">
            <el-form-item label="详细地址">
              <el-input v-model="formData.address"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
      <span slot="footer" class="dialog-footer">
        <el-button @click="dialogVisible = false" size="small">取消</el-button>
        <el-button @click.stop="submitForm()" type="primary" size="small"
          >确定</el-button
        >
      </span>
    </el-dialog>

    <!-- 添加标签 -->
    <el-dialog
      title="添加标签"
      :visible.sync="dialogVisible555"
      width="800px"
      @close="close666"
    >
      <el-row>
        <div>
          <span style="display: block; margin-bottom: 10px; font-weight: blod"
            >标签名称:</span
          >
          <!-- <el-autocomplete
            class="inline-input"
            v-model="label"
            :fetch-suggestions="querySearch"
            placeholder="请输入标签"
            value-key="context"
            clearable
          ></el-autocomplete> -->
          <el-select v-model="label" clearable placeholder="请选择标签">
            <el-option
              v-for="item in labels"
              :key="item.id"
              :label="item.context"
              :value="item.context"
            ></el-option>
          </el-select>
        </div>
      </el-row>
      <span slot="footer" class="dialog-footer">
        <el-button @click="up" type="primary" size="small">确定</el-button>
      </span>
    </el-dialog>

    <!-- 日志查看 -->
    <logDialog
      :corporateNameTitle="corporateNameTitle"
      :logDialogVisible.sync="logDialogVisible"
      @closeDialog="logCloseDialog"
      ref="mychildlog"
    />
  </div>
</template>

<script>
import { listUser } from "@/api/system/user";
import { checkPermi, checkRole } from "@/utils/permission"; // 权限判断函数
import {
  getData00,
  submitAptitudeForm,
  update,
  deleteData,
  queryLevel,
  uploadFile,
  receiveData,
  appleSubmitForm,
  getLabels,
  getCountryList,
  getInfo
} from "@/api/resourced";
// import { listUser } from "@/api/systemSettings/resource";
import logDialog from "./logDialog.vue";
export default {
  components: { logDialog },
  props: [],
  data() {
    return {
      countryList:[],
      labels: [],
      applyListData888: [],
      // pageNum888:1,
      // todelpage888:0,
      uploadList: [],
      label: "",
      uploading: false,
      uploadFile666: {},
      dialogVisible555: false,
      // 记录
      corporateNameTitle: "",
      logDialogVisible: false,
      title666: "",
      rules2: {
        email: [
          { required: true, message: "邮箱地址不能为空", trigger: "blur" },
          // {
          //   type: "email",
          //   message: "'请输入正确的邮箱地址",
          //   trigger: ["blur", "change"],
          // },
        ],
        // customerPhone: [
        //   { required: true, message: "请输入联系电话", trigger: "blur" },
        // ],
        companyName: [
          { required: true, message: "请输入公司名称", trigger: "blur" },
        ],
        country: [
          { required: true, message: "请选择所属国家", trigger: "blur" },
        ],
        customerName: [
          { required: true, message: "请输入联系人", trigger: "blur" },
        ],
        // address: [
        //   { required: true, message: "请输入地址", trigger: "blur" },
        // ],
        customerRole:[
          { required: true, message: "请选择客户类型", trigger: "blur" },
        ],
        grade:[
          { required: true, message: "请选择客户等级", trigger: "blur" },
        ],
        customerType:[
          { required: true, message: "请选择新老客户", trigger: "blur" },
        ],
        source:[
          { required: true, message: "请输入客户来源", trigger: "blur" },
        ]
      },
      options888: [
        {
          value: "50",
          label: "50"
        },
        {
          value: "100",
          label: "100"
        },
        {
          value: "200",
          label: "200"
        },
        {
          value: "300",
          label: "300"
        },
        {
          value: "400",
          label: "400"
        },
        {
          value: "500",
          label: "500"
        }
      ],
      input333: undefined,
      input666: undefined,
      input444: undefined,
      input555: undefined,
      input: "",
      openFlag: true,
      addVisible: false,
      loading: true,
      show: false,
      //数据
      tableData: [],
      tableData1: [],
      tableHeight: 0,
      // tableHeight1: 0,
      add: false,
      delet: false,
      get: false,
      update: false,
      batch: false,
      params: {
        userId: 0,
        pageNum: 1,
        pageSize: 10,
        companyName: "",
        customerPhone: "",
        grade: "",
        customerName: "",
        label: "",
        address: "",
        source: "",
        customerRole: "",
        customerType: "",
        country: "",
        email: "",
        officialWebsite: "",
        belonger: ""
      },
      pageTotal: 0,
      pageTotal1: 0,
      dialogVisible: false, // 是否展示编辑页面
      //删除
      multipleSelection: [],
      multipleSelection1: [],
      delList: [],
      // 新增/编辑数据
      formData: {
        userId: 0
      },
      customer: {
        customerId: ""
      },
      dialogStatus: 0,
      //资质查看
      viewDialogVisible: false,

      //用户id
      adminId: "",
      stateList: [
        {
          id: 1,
          title: "已合作"
        },
        {
          id: 2,
          title: "有意向"
        },
        {
          id: 3,
          title: "待开发"
        }
      ],
      typeList: [
        // {
        //   id: "0",
        //   title: "未知"
        // },
        {
          id: "1",
          title: "新客户"
        },
        {
          id: "2",
          title: "老客户"
        }
      ],
      customerRoleList: [],
      levelList: [],
      levelList5: [],
      qccQuery: [
        {
          id: true,
          title: "已查"
        },
        {
          id: false,
          title: "未查"
        }
      ],
      //资质添加
      setValue: [],
      paramsFlag: 0,
      continentlist: [
        {
          value: "亚洲",
          label: "亚洲"
        },
        {
          value: "北美洲",
          label: "北美洲"
        },
        {
          value: "南美洲",
          label: "南美洲"
        },{
          value: "大洋洲",
          label: "大洋洲"
        },
        {
          value: "欧洲",
          label: "欧洲"
        },
        {
          value: "非洲",
          label: "非洲"
        }
      ],
      editFlags: false,
      applyVisible: false,
      sysUserList: [],
      applyData: {
        // sourceUid:JSON.parse( localStorage.getItem('adminData') ).id,
        type: 1,
        targetUid: "",
        ids: "",
        reason: ""
      },
      //转移申请
      rules: {
        targetUid: [
          { required: true, message: "请输入被转移人", trigger: "change" }
        ],
        ids: [{ required: true, message: "请选择转移客户", trigger: "change" }]
      },
      // 转移人员
      transferPeopleParams: {
        pageNum: 1,
        pageSize: 10,
        companyName: "",
        grade: ""
      },
      options: [],
      // 控制批量删除按钮
      isOperate: true,
      prop: 'createTime',
      sort: 'descending'
    };
  },
  computed: {},
  created() {
    this.getData00();
    // this.adminId=JSON.parse( localStorage.getItem('adminData') ).id;
    // this.getList()
    this.getDicts("customerRole").then(response => {
      this.customerRoleList = response.data;
    });
    this.getDicts("qudao").then(response => {
      this.levelList5 = response.data;
    });
    this.fetchLevelList();
    this.getSysUserList();
  },
  filters: {
    formatDate: function(value) {
      let date = new Date(parseInt(value) * 1000);
      let y = date.getFullYear();
      let m = date.getMonth() + 1;
      m = m < 10 ? "0" + m : m;
      let d = date.getDate();
      d = d < 10 ? "0" + d : d;
      let h = date.getHours();
      h = h < 10 ? "0" + h : h;
      let minute = date.getMinutes();
      let second = date.getSeconds();
      minute = minute < 10 ? "0" + minute : minute;
      second = second < 10 ? "0" + second : second;
      return y + "-" + m + "-" + d + " " + h + ":" + minute + ":" + second;
    }
  },
  mounted() {
    this.$nextTick(function() {
      this.tableHeight = window.innerHeight - this.$refs.multipleTable.$el.offsetTop - 150;
      let self= this;
      window.onresize = function(){
        self.tableHeight = window.innerHeight - self.$refs.multipleTable.$el.offsetTop - 150;
      }
    });
    // console.log(this.tableHeight1,'1222222222222222')
    this.getLabels();
    this.getCountryList()
  },
  watch: {},
  directives: {
    "el-select-loadmore": {
      bind(el, binding) {
        var _this = this;
        const SELECTWRAP_DOM = el.querySelector(
          ".el-select-dropdown .el-select-dropdown__wrap"
        );
        SELECTWRAP_DOM.addEventListener("scroll", function() {
          const condition =
            this.scrollHeight - this.scrollTop - 1 <= this.clientHeight;
          if (condition) {
            binding.value();
          }
        });
      }
    }
  },
  methods: {
    checkPermi,
    checkRole,
    handleSortChange({ column, prop, order }){
      let data = JSON.parse(JSON.stringify(this.params));;
      this.prop = {prop}.prop;
      this.sort = {order}.order;
      data["clouname"] = this.prop;
      data["sort"] = this.sort;
      getData00(data)
        .then((res) => {
          console.log(res, "客户管理列表");
          if (res.code == "200") {
            this.tableData = res.rows;
            this.pageTotal = res.total;
            this.loading = false;
          }
        })
        .catch(() => {
          console.log("error submit!!");
          return false;
        });
    },
    // 获取国家列表
    getCountryList() {
      getCountryList().then(
        (response) => {
          console.log(response)
          this.countryList = response.rows;
        }
      );
    },
    // 国家州的绑定
    choose_country(e){
      console.log(e)
      // 找到国家对应的洲进行绑定
      var str = this.countryList.find(function (item) {
        return item.country == e;
      });
      this.formData.continent=str.continent;
    },
    fetchLevelList() {
      queryLevel().then(res => {
        this.levelList = res.rows;
      });
    },
    querySearch(queryString, cb) {
      console.log(queryString, this.labels);
      var restaurants = this.labels;
      var results = queryString
        ? restaurants.filter(this.createFilter(queryString))
        : restaurants;
      // 调用 callback 返回建议列表的数据
      cb(results);
    },
    createFilter(queryString) {
      return restaurant => {
        return (
          restaurant.context
            .toLowerCase()
            .indexOf(queryString.toLowerCase()) === 0
        );
      };
    },
    getLabels() {
      getLabels({
        pageNum: 1,
        pageSize: 9999
      }).then(res => {
        if (res.code == 200) {
          this.labels = res.rows;
        }
      });
    },

    close666() {
      this.uploadFile666 = {};
      this.uploadList = [];
    },
    // 增加标签
    up() {
      this.dialogVisible555 = false;
      let item = this.uploadFile666;
      const form = new FormData();
      form.append("upfile", item.file);
      this.uploading = true;
      console.log(form);
      uploadFile(0, this.label, form)
        .then(res => {
          if (res.code == "200") {
            this.$message.success(`数据导入成功`);
            this.uploading = false;
            this.getData00();
          } else {
            this.$message.error(`${res.message}`);
            this.messageContent = res.message;
          }
        })
        .catch(() => {
          console.log("error submit!!");
          this.uploading = false;
          return false;
        });
    },
    fileExceed() {
      this.$message.error("别贪心！一次只能上传一个哦~");
    },
    // 管理员上传
    uploadFile(item) {
      console.log(item);
      this.dialogVisible555 = true;
      this.uploadFile666 = item;
    },
    //日志查看
    handleViewLog(index, row) {
      console.log(row);
      this.logDialogVisible = true;
      this.$refs.mychildlog.getDataMore(row.id);
      this.corporateNameTitle = row.companyName;
    },
    //关闭日志查看弹窗
    logCloseDialog() {
      this.logDialogVisible = false;
    },
    submitForm() {
      // console.log(this.formData, "提交的客户资源-------");
      this.$refs["zhiyuanRuleForm"].validate(valid => {
        if (valid) {
          if (this.title666 == "新增") {
            submitAptitudeForm(this.formData).then(res => {
              console.log(res);
              if (res.code == 200) {
                this.$message.success(`新增成功`);
                this.dialogVisible = false;
                this.getData00();
              }
            });
          } else {
            update(this.formData).then(res => {
              if (res.code == 200) {
                this.$message.success(`修改成功`);
                this.dialogVisible = false;
                this.uploading = false;
                this.getData00();
              }
            });
          }
        }
      });
    },
    search6() {
      this.params.companyName = this.input333;
      this.params.label = this.input444;
      this.params.grade = this.input555;
      this.params.email = this.input666;
      this.$set(this.params, "pageNum", 1);
      this.paramsFlag = 0;
      this.getData1();
    },
    remoteMethod(query) {
      this.options = [];
      this.transferPeopleParams.pageNum = 1;
      if (query !== "") {
        this.transferPeopleParams.companyName = query;
        this.getList();
      } else {
        this.transferPeopleParams.companyName = "";
        this.getList();
      }
    },
    loadmore() {
      this.transferPeopleParams.pageNum++;
      this.getList();
    },
    // getList() {
    //     getList(this.transferPeopleParams)
    //             .then((res) => {
    //               if(res.code=='200'){
    //                   if( res.data.results==null ) res.data.results=[];
    //                   this.options = [...this.options, ...res.data.results];
    //               }
    //         })
    //  },
    //提交申请
    allApply() {
      this.applyVisible = true;
      this.params.pageNum = 1;
      this.applyData = {
        sourceUid: localStorage.getItem("useId"),
        type: 1,
        targetUid: "",
        ids: "",
        reason: ""
      };
      this.getData1();
      this.getSysUserList();
    },
    getSysUserList() {
      listUser({
        pageNum: 1,
        pageSize: 1000
      }).then(res => {
        this.sysUserList = res.rows;
        // console.log(this.sysUserList, "转移人列表--------------");
      });
    },
    // 领取资源
    handleReceive(row) {
      receiveData(row.id).then(res => {
        if (res.code == 200) {
          this.msgSuccess("资源领取成功");
          this.getData00();
        }
      });
    },
    // 下发资源
    appleSubmitForm() {
      this.$refs["ruleForm"].validate(valid => {
        // console.log("看看看有没有校验");
        if (valid) {
          if (this.multipleSelection1.length == 0) {
            return this.msgError("必须选择一条资源！");
          }
          appleSubmitForm({
            userId: this.applyData.targetUid,
            ids: this.multipleSelection1
          })
            .then(res => {
              if (res.code != 200) {
                setTimeout(() => {
                  this.$message.error(`下发失败`);
                }, 0.1 * 1000);
              } else {
                setTimeout(() => {
                  this.$message.success(`下发成功`);
                  this.applyVisible = false;
                  this.multipleSelection1 = [];
                }, 0.1 * 1000);
                this.getData00();
              }
            })
            .catch(() => {});
        }
      });
    },
    openSearch() {
      this.openFlag = !this.openFlag;
      this.params={
        userId: 0,
        pageNum: 1,
        pageSize: 10,
        companyName: "",
        customerPhone: "",
        grade: "",
        customerName: "",
        label: "",
        address: "",
        source: "",
        customerRole: "",
        customerType: "",
        country: "",
        email: "",
        officialWebsite: "",
        belonger: ""
      }
    },
    cancelData() {
      this.params = {
        userId: 0,
        pageNum: 1,
        pageSize: 10,
        companyName: "",
        customerPhone: "",
        grade: "",
        customerName: "",
        label: "",
        address: "",
        source: "",
        customerRole: "",
        customerType: "",
        country: "",
        email: "",
        officialWebsite: "",
        belonger: ""
      };
      this.getData00();
    },
    formatLevel(val) {
      var str = this.levelList.find(function(item) {
        return item.gradeValue == val;
      });
      if (str) return str.gradeName;
    },
    formatState(val) {
      var str = this.stateList.find(function(item) {
        return item.id == val;
      });
      if (str) return str.title;
    },
    formatType(val) {
      var str = this.typeList.find(function(item) {
        return item.id == val;
      });
      if (str) return str.title;
    },
    formatRole(val) {
      var str = this.customerRoleList.find(function(item) {
        return item.dictValue == val;
      });
      if (str) return str.dictLabel;
    },
    formatSource(val) {
      var str = this.levelList5.find(function(item) {
        return item.dictValue == val;
      });
      if (str) return str.dictLabel;
    },
    //资质查看
    handleView(index, row) {
      this.viewDialogVisible = true;
      this.$refs.mychild.getDataMore(row.id);
      this.corporateNameTitle = row.companyName;
    },
    //关闭资质查看弹窗
    viewCloseDialog() {
      this.viewDialogVisible = false;
    },
    handleAdd() {
      this.formData = {
        userId: 0
      };
      this.dialogVisible = true;
      this.title666 = "新增";
    },
    handleEdit(index, row) {
      getInfo(row.id).then(res => {
        if(res.code == 200){
          // console.log(res.data,'1111111111111111111111111111111111111')
          this.formData = res.data;
          this.dialogVisible = true;
          this.title666 = "更新";
        }
      })

    },
    //编辑页面弹窗
    closeDialog() {
      this.dialogVisible = false;
    },
    // 删除操作
    handleSelectionChange(val) {
      if (val.length != 0) {
        this.multipleSelection = val.map(item => item.id);
        this.isOperate = false;
      } else {
        this.isOperate = true;
      }
    },
    handleSelectionChange1(val) {
      this.multipleSelection1 = val.map(item => item.id);
    },
    delAllSelection() {
      // const length = this.multipleSelection.length;
      let str = "";
      // this.delList = this.delList.concat(this.multipleSelection);
      // for (let i = 0; i < length; i++) {
      //   str += this.multipleSelection[i].id + ",";
      // }
      // if (str.length == 0) {
      //   this.$message.error("必须选择一项！");
      //   return;
      // }
      str = this.multipleSelection.join(",");
      this.$confirm("确定要删除吗？", "提示", {
        type: "warning"
      })
        .then(() => {
          this.deleteData(str);
          this.multipleSelection = [];
        })
        .catch(() => {});
    },
    handleDelete(index, row) {
      this.$confirm("确定要删除吗？", "提示", {
        type: "warning"
      })
        .then(() => {
          this.deleteData(row.id);
        })
        .catch(() => {});
    },
    deleteData(id) {
      deleteData(id)
        .then(res => {
          if (res.code == "200") {
            this.$message.success("删除成功");
            this.getData00();
          } else {
            this.$message.error("删除失败");
          }
        })
        .catch(() => {
          console.log("error submit!!");
          return false;
        });
    },
    //获取数据
    getData00() {
      var _this = this;
      let data = JSON. parse(JSON.stringify(this.params))
      data["clouname"] = this.prop
      data["sort"] = this.sort
      this.loading = false;
      getData00(data)
        .then(res => {
          if (res.code == "200") {
            this.tableData = res.rows;
            this.pageTotal = res.total;
            this.loading = false;
          }
        })
        .catch(() => {
          console.log("error submit!!");
          return false;
        });
    },
    getData1() {
      var _this = this;
      let data = this.params;
      getData00(data)
        .then(res => {
          if (res.code == "200") {
            this.tableData1 = res.rows;
            this.pageTotal1 = res.total;
            // this.add = res.data.add;
            // this.delet = res.data.delete;
            // this.update = res.data.update;
            // this.get = res.data.get;
            // this.batch = res.data.batch;
            // this.show = res.data.show;
          }
        })
        .catch(() => {
          console.log("error submit!!");
          return false;
        });
    },
    //获取数据
    // getData1() {
    //   var _this = this;
    //  let data=  this.paramsFlag ==0 ?  this.searchparams : this.params;
    //   getData00(data)
    //     .then(res => {
    //       if (res.code == "200") {
    //         this.tableData1 = res.data.results;
    //         this.pageTotal = res.data.count;
    //         this.loading = false;
    //       }
    //     })
    //     .catch(() => {
    //       console.log("error submit!!");
    //       return false;
    //     });
    // },
    //获取资源到个人的客户管理
    getSharedCustomer(index, row) {
      var _this = this;
      this.customer.customerId = row.id;
      getSharedCustomer(this.customer)
        .then(res => {
          if (res.code == "200") {
            this.$message.success(`${res.message}`);
            this.getData00();
          } else {
            this.$message.error(`${res.message}`);
          }
        })
        .catch(() => {
          console.log("error submit!!");
          return false;
        });
    },
    // 触发搜索按钮
    /* handleSearch() {
      this.$set(this.params, "page", 1);
      this.getData00();
    }, */
    search() {
      this.$set(this.params, "pageNum", 1);
      this.paramsFlag = 0;
      this.getData00();
    },
    handleSearchOpen() {
      this.addVisible = true;
      this.params = {
        userId: 0,
        pageNum: 1,
        pageSize: 10,
        companyName: "",
        customerPhone: "",
        grade: "",
        customerName: "",
        label: "",
        address: "",
        source: "",
        customerRole: null,
        customerType: null
      };
    },
    handleSearch() {
      this.addVisible = false;
      this.paramsFlag = 1;
      this.$set(this.params, "pageNum", 1);
      this.getData00();
    },
    // 分页导航
    handlePageChange(val) {
      this.$set(this.params, "pageNum", val);
      this.getData00();
    },
    // 分页导航
    handlePageChange1(val) {
      this.$set(this.params, "pageNum", val);
      this.getData1();
    }
  }
};
</script>

<style>
.timeDate .el-date-editor {
  width: 50%;
  float: left;
}
</style>
<style scoped>
.container {
  padding: 5px 20px !important;
}
.handle-box {
  margin-bottom: 10px;
}

.handle-select {
  width: 120px;
}

.handle-input {
  width: 300px;
  display: inline-block;
}
.table {
  width: 100%;
  font-size: 14px;
}
.red {
  color: #ff0000;
}
.yellow {
  color: #f57506;
}
.green {
  color: green;
  cursor: pointer;
}
.blue {
  color: #409eff;
  cursor: pointer;
  text-decoration: underline;
}
.mr10 {
  margin-right: 10px;
}
.table-td-thumb {
  display: block;
  margin: auto;
  width: 40px;
  height: 40px;
}
.search-box {
  margin-bottom: 10px;
  padding: 10px 10px 10px 10px;
  border-radius: 4px;
  box-sizing: border-box;
  background: #fff;
  border: 1px solid #ddd;
  border-radius: 5px;
}
.searchForm .el-form-item--mini.el-form-item,
.searchForm .el-form-item--small.el-form-item {
  margin-bottom: 1px;
}
/* .search-box .el-input {
  width: 200px;
  margin-right: 10px;
} */
</style>
